@color: #193461;
@topH: 60px;
@bottomH: 45px;
@loginW: 372px;
@error: #ff0000;

body {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

#top {
  width: 100%;
  height: @topH;
  border-bottom: 4px solid @color;
  box-sizing: border-box;
  position: relative;
  text-align: right;

  .register-top-span {
    position: absolute;
    margin: 17px;
    left: 6%;
    height: 15px;
    font-size: 14px;
    font-family: MicrosoftYaHei;
    font-weight: 400;
    color: rgba(51, 51, 51, 1);

    ul {
      list-style-type: none;
      margin: 0;
      padding: 0;

      li {
        display: inline;
        margin: 0 10px;
        a {
          text-decoration: none;
          font-size:14px;
          font-family:MicrosoftYaHei;
          font-weight:bold;
          color:#000000;

          &:hover {
            color: #02A9E6;
          }

          &:active {
            color: #02A9E6;
          }
        }
      }
    }

  }

  .logo {
    margin: 15px 6%;
  }

  .icon {
    height: @topH * 0.8;
    position: absolute;
    bottom: -@topH * 0.8 / 2;
    right: 20%;
    background: #ffffff;
    padding: 0 10px;
  }
}

#container {
  width: 100%;
  height: calc(100vh - @topH - @bottomH);
  box-sizing: border-box;
  padding: 60px 60px;
  .icon-list{
    width: 50%;
    height:496px;
    background:rgba(245,245,245,1);
    opacity:0.5;
  }
}

#bottom {
  width: 100%;
  height: @bottomH;
  border-top: 4px solid @color;
  box-sizing: border-box;
  text-align: center;
  line-height: @bottomH - 4px;
  font-size: 15px;
}
